
// workder.js
registerPaint(
  "maskChange",
  class {
    static get inputProperties() {
      return ["--size-x", "--size-y", "--transition-time"];
    }

    paint(ctx, size, properties) {
      // 获取变量
      const x = properties.get("--size-x");
      const y = properties.get("--size-y");
      const t = properties.get("--transition-time"); // 变化过程中的t值
      const width = size.width / x;
      const height = size.height / y;
      const l = 10;

      const mask = 0xffffffff;
      const seed = 100; /* update this to change the generated sequence */
      let m_w = (123456789 + seed) & mask;
      let m_z = (987654321 - seed) & mask;

      let random = function () {
        m_z = (36969 * (m_z & 65535) + (m_z >>> 16)) & mask;
        m_w = (18000 * (m_w & 65535) + (m_w >>> 16)) & mask;
        var result = ((m_z << 16) + (m_w & 65535)) >>> 0;
        result /= 4294967296;
        return result;
      };

      for (let i = 0; i < x; i++) {
        for (let j = 0; j < y; j++) {
          const r = 
          ctx.fillStyle = "rgba(0,0,0," + ((random()*(l-1) + 1) - (1-t)*l) + ")";
          ctx.fillRect(i * width, j * height, width, height);
        }
      }
    }
  }
);